<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    {% include "component/static_resource_css.html" %}
    <title>个人主页</title>
</head>
<body>
<div class="nk-container">
    {% include 'component/header.html' %}

    <!--		 内容 -->
    <div class="main">
        <div class="container">
            <!-- 选项 -->
            <div class="position-relative">
                <ul class="nav nav-tabs">
                    <li class="nav-item">
                        <a class="nav-link nav0" href="/user/profile/{{ user.id }}">个人信息</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link nav1" href="/user/discuss/{{ user.id }}">我的帖子</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link nav2" href="/user/comment/{{ user.id }}">我的回复</a>
                    </li>
                </ul>
            </div>


            <!-- 个人信息 -->
            <div class="media mt-5">
                <img src="{{ user.header_url }}" class="align-self-start mr-4 rounded-circle" alt="用户头像"
                     style="width:50px;">
                <div class="media-body">
                    <h5 class="mt-0 text-warning">
                        <span text="{{ user.username }}">{{ user.username }}</span>
                        <input type="hidden" id="entityId" value="{{ user.id }}">
                        {% if cu.id !=user.id %}
                            {% if cu.like == 1 %}
                                <button type="button"
                                        class="btn-sm float-right mr-5 follow-btn btn-info btn-info like01">
                                    已关注
                                </button>
                            {% else %}
                                <button type="button" class="btn-sm float-right mr-5 follow-btn btn-secondary like01">
                                    关注TA
                                </button>
                            {% endif %}
                        {% endif %}
                    </h5>
                    <div class="text-muted mt-3">
                        <span>注册于 <i class="text-muted">{{ user.create_time }}</i></span>
                    </div>
                    <div class="text-muted mt-3 mb-5">
                        <a class="text-primary" href="/user/followees/{{ user.id }}" style="margin-right: 6px">
                            <button type="button" class="btn btn-secondary">
                                关注了 <span class="badge badge-info">{{ user.user_like_count }}</span> 人
                            </button>
                        </a>
                        <a class="text-primary" href="/user/followers/{{ user.id }}" style="margin-right: 6px">
                            <button type="button" class="btn btn-secondary">
                                关注者 <span class="badge badge-info"> {{ user.like_user_count }}</span> 人
                            </button>
                        </a>

                        <button type="button" class="btn btn-secondary">
                            获得了 <span class="badge badge-light">{{ user.post_like_count }}</span> 个赞
                        </button>

                    </div>


                </div>
            </div>
        </div>
    </div>

    {% include "component/footer.html" %}
</div>

{% include "component/static_resource_js.html" %}
<script>
    $(document).ready(function () {
            console.log("{{cu.like}}")
            var np = ".nav" + "{{profile_type}}"
            $(np).addClass('active')
        }
    );
    {#关注用户#}
    $('.like01').click(function () {
        abc = $(this)
        var data = {likeType: 1, userId: "{{ user.id }}"};
        $.ajax({
            type: 'POST',
            url: "http://127.0.0.1:5000/user/like",
            dataType: 'json',
            contentType: "application/json",
            data: JSON.stringify(data),
            isCorrect: function () {
                alert("ok")
            },
            success: function (data) {
                if (data.data == 0) {
                    {#修改样式#}
                    $('.like01').removeClass('btn-info')
                    $('.like01').addClass('btn-secondary')
                    abc.text("关注TA")
                    alert("取消关注");
                } else {
                    $('.like01').removeClass('btn-secondary')
                    $('.like01').addClass('btn-info')
                    abc.text("已关注")
                    alert("关注成功");
                }
                if ((data.code + '')[0] != '2') {
                    alert("失败")
                    console.error(data.msg)
                    return
                }
            },
            error: function () {
                alert("未登录")
            },
        })
    })
</script>
</body>
</html>
